<template>
  <t-dialog :header="row ? `修改学习记录-${row.materialsName}` : '新增学习记录'" :visible.sync="visible" :onClose="closeDialog"
    :closeOnOverlayClick="false" :onConfirm="onClick" width="40%" top="5%">
    <div style="height: 55vh; width: 100%; display: flex">
      <t-form :data="formData" labelWidth="100px" style="margin: auto;width: 100%;">
        <t-form-item label="学习资料" name="materialsId">
          <t-select clearable v-model="formData.materialsId" placeholder="请选择学习资料" filterable>
            <t-option v-for="item in listData" :key="item.id" :value="item.id + ''"
              :label="item.materialsName"></t-option>
          </t-select>
        </t-form-item>
        <t-form-item label="学习专家" name="userName">
          <t-select clearable v-model="formData.userName" placeholder="请选择学习专家" filterable>
            <t-option v-for="item in ZJData" :key="item.sysUser.id" :value="item.sysUser.nickName"
              :label="item.sysUser.nickName"></t-option>
          </t-select>
        </t-form-item>
        <t-form-item label="学习开始时间" name="startTime">
          <t-date-picker enable-time-picker v-model="formData.startTime" />
        </t-form-item>
        <t-form-item label="学习结束时间" name="endTime">
          <t-date-picker enable-time-picker v-model="formData.endTime" />
        </t-form-item>
        <t-form-item label="学习总结" name="summary">
          <t-textarea v-model="formData.summary" :autosize="{ minRows: 5 }" placeholder="请输入学习总结" />
        </t-form-item>
        <t-form-item label="附件" name="sysAttMainVo">
          <file-upload v-model="formData.sysAttMainVo.sysAttMainIds" :moduleKey="formData.moduleKey"
            :fileList="formData.fileLists" :multiple="true">
            <t-button variant="outline">
              <t-icon name="cloud-upload" slot="icon" />
              点击上传
            </t-button>
          </file-upload>
        </t-form-item>
      </t-form>
    </div>
  </t-dialog>
</template>

<script>
import FileUpload from '@/components/FileUpload/index.vue';
import { getFiles } from '@/api/common';

export default {
  components: {
    FileUpload,
  },
  dicts: ['materials_format'],
  props: {
    objId: [String, Number],
    header: String,
    row: {
      type: Object,
      default: null,
    },
  },
  data () {
    return {
      listData: [],
      ZJData: [],
      visible: true,
      formData: {
        fileLists: [],
        summary: '',
        endTime: '',
        moduleKey: 'zjkxxjl',
        startTime: '',
        materialsId: '',
        userName: '',
        materialsName: '',
        sysAttMainVo: {
          sysAttMainIds: [],
        },
      },
      queryParams: {
        pageNum: 1,
        pageSize: 1000,
        approveType: '',
        businessName: '',
      },
    };
  },
  created () {
    this.getList()
    this.getZJList()
    if (this.row) {
      getFiles(this.row.id)
        .then((res) => {
          res.data.forEach((item) => {
            this.formData.fileLists.push({
              name: item.fileName,
              url: item.fullFilePath,
              id: item.id,
              filePath: item.filePath,
            });
          });
        })
        .catch((e) => {
          this.$message.error(e.toString());
        });

      this.$api.zjk.learning.detailLearningRecord(this.row.id).then(res => {
        var data = res.data
        data.sysAttMainVo = {
          sysAttMainIds: []
        }
        this.formData = { ...this.formData, ...data }

      }).catch(e => {
        this.$message.error(e.toString())
      })
    }
  },
  methods: {
    closeDialog () {
      this.$emit('update:visible', false);
    },
    getList () {
      this.$api.zjk.learning
        .learningMaterials(this.queryParams)
        .then((response) => {
          this.listData = response.rows;
        })
        .catch((e) => {
          this.$message.error(e.toString());
        });
    },
    getZJList () {
      this.$api.zjk.expert.list(this.queryParams).then((res) => {
        this.ZJData = res.rows.map((row, index) => ({ ...row, index }));
      }).catch((e) => {
        this.$message.error(e.toString());
      });
    },
    onClick () {
      console.log(this.listData, this.formData.materialsId);

      this.listData.forEach(item => {
        if (item.id == this.formData.materialsId) {
          this.formData.materialsName = item.materialsName
        }
      })
      if (this.row) {
        this.$api.zjk.learning
          .updateLearningRecord({ ...this.formData, id: this.row.id })
          .then((res) => {
            console.log(res);
            this.closeDialog();
            this.$message.success('编辑成功');
            this.$emit("reload");
          })
          .catch((e) => {
            this.$message.error(e.toString());
          });
      } else {
        this.$api.zjk.learning
          .addLearningRecord(this.formData)
          .then((res) => {
            console.log(res);
            this.closeDialog();
            this.$message.success('新增成功');
            this.$emit("reload");
          })
          .catch((e) => {
            this.$message.error(e.toString());
          });
      }
    },
  },
};
</script>
